$(function() {
    // alert('ok')

    // 弹层对象
    var form = layui.form
        // 表单对象
    var layer = layui.layer



    /* ----------1、获取所有的图片信息，渲染到页面----------------- */
    initCateMap();

    function initCateMap() {
        $.ajax({
            type: 'get',
            url: '/admin/swipers',
            success: function(res) {
                // console.log(res);
                // 判断
                if (res.status !== 0) {
                    return $('tbody').html('暂无轮播图数据')
                }
                // 渲染页面
                var htmlStr = template('tpl-cate', res)
                    // console.log(htmlStr);
                $('tbody').html(htmlStr)
            }
        })
    }


    /* -------2、切换勾选状态---------- */
    toogle()

    function toogle() {
        $('tbody').on('click', '.layui-badge', function() {
            // console.log('ok');
            // (1)获取勾选状态的id
            var id = $(this).attr('data-id')
                // console.log(id);
            var status = $(this).attr('data-status')
            console.log(status);

            //发送请求
            $.ajax({
                type: 'put',
                url: '/admin/swipers/' + id,
                data: { status },
                success: function(res) {
                    console.log(res);
                    // 判断
                    if (res.status !== 0) {
                        return layer.msg(res.message)
                    }
                    initCateMap()

                }
            })


        })

    }


    /* -------3、批量上传------------------- */
    uploadSwiper()

    function uploadSwiper() {

        $('#uploadSwiper').on('click', function() {
            // 弹出图片选择框
            // console.log('ok');
            $('#myfile').click()
        })
        $('#myfile').on('change', function() {

            var fd = new FormData()
            var files = Array.from(this.files)

            for (var i = 0; i < files.length; i++) {
                // console.log(files[i]);
                fd.append('swipers', files[i])

            }
            console.log(fd);
            // 判断是否选择了文件
            if (files.length <= 0) {
                return layer.msg('请选择一个图片')
            } else if (files.length >= 20) {
                return layer.msg('图片数量不要超过20张')
            }

            $.ajax({
                type: 'POST',
                url: '/admin/swipers',
                data: fd,
                processData: false,
                contentType: false,
                success: function(res) {
                    // console.log(res);
                    // 判断
                    if (res.status !== 0) {
                        return layer.msg(res.message)
                    }

                    initCateMap();
                }
            })

        })
    }

    /* -------4、删除功能-------------------- */
    $('tbody').on('click', '.layui-btn', function() {
        // (1)获取被删除分类的id
        var id = $(this).attr('data-id')
            // console.log(id);
            // (2)询问
        layer.confirm('您确定要删除此轮播图吗?', { icon: 3, title: '提示' }, function(index) {
            //do something
            // (3)发请求
            $.ajax({
                type: 'DELETE',
                url: '/admin/swipers/' + id,
                success: function(res) {
                    // console.log(res)
                    // 判断
                    if (res.status !== 0) {
                        return layer.msg(res.message)
                    }
                    // 重新渲染分类列表
                    initCateMap();
                }
            })

            layer.close(index);
        });
    })
})